<template>
<TraceabilityDetailtyDetail />
<div>
      <el-radio-group v-model="from.radio1" @change="FarmMessage" size="large">
        <el-radio-button label="养殖信息(5/5)"  :value="1"  />
        <el-radio-button label="屠宰信息(5/5)"  :value="2" />
        <el-radio-button label="深加工信息(0/5)" :value="3" />
      </el-radio-group>
    </div>
<h2>深加工信息</h2>
</template>
<script lang="ts" setup>
import TraceabilityDetailtyDetail from '@/views/TraceabilityManagements/PublicTraceabilityDetailsView.vue'
import { DelPicc } from '@/api/admin/index'
import { Plus } from '@element-plus/icons-vue'
import {type Pic} from '@/api/admin/type'
import{AddPic} from '@/api/admin/index'
import type { UploadProps, UploadUserFile } from 'element-plus'
import {GetTraceabilityIndexById} from '@/api/admin/index'
import { reactive, ref,onMounted } from 'vue'
import { ElMessage, type FormInstance, type FormRules } from 'element-plus'
import { useRouter, useRoute } from 'vue-router'
import axios from 'axios'
const route = useRoute()
const router = useRouter()

onMounted(()=>{
    GetTraceabilityById()
    console.log( from.value.radio1);
    FarmMessage()
   
})
const from=ref({
    indexId:null,
  dialogFormVisible:false,
  shopName:'',
  batch:'',
  expiration:null,
  production_License:'',
  manufacturing:'',
  information:'',
  image:'',
  createById:null,
  createByName:'' ,
  createTime :'',
  isno:false,
  IsDeleted:false,
  imagess:'',
  fileList:[],
  radio1:3
})
const rerepic=ref([])
const data=ref([])
console.log(from.value);
const fileList = ref([
  {
    url: '',
  },
])


const GetTraceabilityById = async () => {
    const res = await GetTraceabilityIndexById(Number(localStorage.getItem("TraceabilityId")));
    from.value = res.data;
    if (res.data.imagess) {
      const imagesArray = res.data.imagess.split(',');

      // 清空 fileList
      fileList.value = [];

      // 将每个图片路径添加到 fileList
      imagesArray.forEach(image => {
        fileList.value.push({ url: image.trim() });
      });
      console.log('File List:', fileList.value); // 查看结果
    } 
};

const dialogImageUrl = ref('')
const dialogVisible = ref(false)

const handleRemove: UploadProps['onRemove'] = (uploadFile, uploadFiles) => {
  console.log(uploadFile, uploadFiles)
  
  DelPic(uploadFile.url)
}
const handleAvatarSuccess: UploadProps['onSuccess'] = (
  
  response,
  uploadFile
) => {
const aa=('https://localhost:44333'+JSON.stringify(response.url).replace(/"/g,''))
  console.log('https://localhost:44333'+JSON.stringify(response.url).replace(/"/g,''));
  console.log(aa);
 
  if (!fileList.value.some(file => file.url === aa.trim())) {
  fileList.value.push({ url: aa.trim() });
}
 
   console.log(fileList.value);
   addpic(aa)
}
const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile) => {
  dialogImageUrl.value = uploadFile.url!
  dialogVisible.value = true

}

const DelPic=async(val:any)=>{
  
    let inputt=<Pic>{}
        inputt.iid=route.query.Id
        inputt.pic=val
        console.log(inputt);
    const cc=await DelPicc(inputt)
    console.log(cc);
    GetTraceabilityById()
}
const addpic=async(val:any)=>{
    let input=<Pic>{}
        input.iid=route.query.Id
        input.pic=val
      
        
    const bb=await AddPic(input)
    console.log(bb);
    GetTraceabilityById()
}
const FarmMessage=()=>{
    switch(from.value.radio1){
        case 1:
          router.push({name:"TraceabilityHusbandryDetails"})
        break;   
        case 2:
        router.push({name:"TraceabilitySlaughterDetails"})
        break;  
        case 3:
        router.push({name:"TraceabilityDeepProcessingDetails"})
        break;   
      }
} 
</script>
